<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
				font-family: "微软雅黑";
			}
		</style>
		<link rel="stylesheet" type="text/css" href="css/No.1child.css"/>
	</head>
	<body>
	 <div id="box">
		 	  <div id="box1">
		 	    <p id="sp1">动态</p>
		 	  	<p id="sp2">发现</span>
		 	     <img id="img1" src="img2/Deezer.png"/>
		 	     <div id="youshang">
		 	       <button id="btn1">注册</button>
		 	       <button id="btn2">登录</button>
		 	     </div>
		 	     
		 	     <div id="youshang2">
		 	     	  <p id="yhyh">欢迎-< </p><p id="yhID"></p><p id="zuxiao"> >-注销</p>
		 	     </div>
		 	     
		 	  </div>
		 <div id="box2">
		 	<img id="imgs1" src="img/login_expore_bg.jpg" alt="" />
		 	<div id="box21">
		 		<div id="box211"><p id="p1">生活</p></div>
		 		<div id="box212">
		 			<div id="pad1">
		 				<p id="pi1">13839</p>
		 				<p id="pi2">历程</p>
		 			</div>
		 		    <div id="pad2">
		 		    	<div id="cv1"></div>
		 		    	<p id="pu1">23136</p>
		 				<p id="pu2">动态</p>
		 		    </div>
		 		</div>
		 	</div>
		 </div>
		<div id="box3">
			<div id="bonxa"></div>
			<div class="san" id="box31">风景</div>
			<div class="san" id="box32">探险家</div>
			<div class="san" id="box33">动态</div>
		</div>
		<div id="boxpar">
		   <div class="dan" id="box31child">
		   	 <div id="baiye">
		   	 	 <div class="bchild"><img  src="img/01062_aspidersview_1280x800.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/01169_1love1_1280x800.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/02720_earlymorninginoia_1280x800.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/03201_peggyscovelighthouse_1920x1200.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/03789_beijingforbiddencitymoat_1920x1200.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/03838_pelicanislandsunset_1920x1200.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/03907_reflectiononthelake_1920x1200.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/03971_ataleofthenorthernlights_1920x1200.jpg"/></div>
		   	 	 <div class="bchild"><img src="img/04017_matherpoint_1920x1200.jpg"/></div>
		   	 	 <div class="bchild" style="border-radius:0 10px 10px 0;"><img src="img2/01722_roadtoamerica_1280x800.jpg"/></div>
		   	 </div>
		   <ul id="pb1">
		   	 	<li class="lis3">
		   	 		<div class="box1child" style="background: url(img2/20171021718409904.jpg) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">起风了唯有努力生存</p>
		   	 			 <p class="ps112">2017年11月12日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">努力，掌控的第一步。</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">276</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">10</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">27</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	 	</li>
		   	 <li class="lis3">
		   	 		<div class="box1child"  style="background: url(img2/201609220000351474473635.png) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">唯你最深得我意</p>
		   	 			 <p class="ps112">2017年11月12日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">即使是我三十岁以后写起从前，也依然会是满纸荒唐</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">20</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">3</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">10</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	 </li>
		   	 </ul>
		<ul id="pb2">
		   	 	 <li class="lis3">
		   	 		<div class="box1child" style="background: url(img2/20171021342581077.jpg) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">一如最初</p>
		   	 			 <p class="ps112">2017年11月12日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">我最喜欢别人对我说的一句话是“你变了”</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">100</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">16</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">90</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	 	</li>
		   	 <li class="lis3">
		   	 		<div class="box1child"   style="background: url(img2/2017102953435363.jpg) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">爱自己是终生浪漫的开始</p>
		   	 			 <p class="ps112">2017年12月14日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">所经历的每一处风景都是向心中的远方前进的标识</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">275</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">13</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">69</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	   </li>
		   	 </ul>
		   	 <ul id="pb3">
		   	 	  <li class="lis3">
		   	 		<div class="box1child"   style="background: url(img2/201707032312249537277.png) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">我心中所向往的远方</p>
		   	 			 <p class="ps112">2017年12月14日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">去过远方才明白，远方除了遥远一无所有</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">400</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">16</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">26</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	 	</li>
		   	 <li class="lis3">
		   	 		<div class="box1child"   style="background: url(img2/dream_11.jpg) no-repeat;">
		   	 			<div class="meng">
		   	 			 <p class="ps111">志存高远方能成就大事</p>
		   	 			 <p class="ps112">2017年11月12日</p>
		   	 			</div>
		   	 		</div>
		   	 		<p class="ps2">让你不堪的，不止一身庸碌</p>
		   	 		<div class="box2child">
		   	 			<div class="pp1" style="float: left;">
		   	 				<p class="psss1">276</p>
		   	 				<p class="psss2">动态</p>
		   	 				<p></p>
		   	 			</div>
		   	 			<div class="pp2" style="float: left;">
		   	 				<p class="psss1">10</p>
		   	 				<p class="psss2">钦佩</p>
		   	 			</div>
		   	 			<div class="pp3" style="float: left;">
		   	 				<p class="psss1">27</p>
		   	 				<p class="psss2">关注</p>
		   	 			</div>
		   	 		</div>
		   	   </li>
		   	 </ul>
		  </div>
	       <div class="dan" id="box32child">
	       	        <div class="yh1" id='wh1' style="position:absolute;top: 300px;left: 300px;">
	       	        	<img class="tou" src="img2/20150212213059_ycnGF.thumb.224_0.jpeg" alt="" />
	       	        	<p class="dx1">尾巴开箱-女</p> <br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh2' style="position:absolute;top: 230px;left: 330px;">
	       	        	<img class="tou" src="img2/144820692.jpg" alt="" />
	       	        	<p class="dx1">幸运的狗子-女</p> <br /><p class="pvc1">酷跑爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh3' style="position:absolute;top: 400px;left: 400px;">
	       	        	<img class="tou" src="img2/20141217124439_EmxBP.jpeg" alt="" />
	       	        	<p class="dx1">伊人诺梦-女</p> <br /><p class="pvc1">文艺青年</p></p>
	       	        </div>
	       	        <div class="yh1" id='wh4' style="position:absolute;top: 230px;left: 470px;">
	       	        	<img class="tou" src="img2/50289265f30e4.jpg" alt="" />
	       	        	<p class="dx1">唯τā命-女</p> <br /><p class="pvc1">青年协会会长</p>
	       	        </div>
	       	        <div class="yh1" id='wh5' style="position:absolute;top: 300px;left: 400px;">
	       	        	<img class="tou" src="img2/51284ff5d3ea4_200x200_3.jpg" alt="" />
	       	        	<p class="dx1">凉城听暖-女</p> <br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh6' style="position:absolute;top: 370px;left: 470px;">
	       	        	<img class="tou" src="img2/8c1001e93901213f8d0d3ec357e736d12f2e95f6.jpg" alt="" />
	       	        	<p class="dx1">南城雨落-女</p> <br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh8' style="position:absolute;top: 200px;left: 400px;">
	       	        	<img class="tou" src="img2/rBACFFLZFOTBpWU-AAAZ9zcHPAI652_200x200_3.jpg" alt="" />
	       	        	<p class="dx1">轻绾青丝-女</p> <br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh9' style="position:absolute;top: 370px;left: 320px;">
	       	        	<img class="tou" src="img2/tu6183_50.jpg" alt="" />
	       	        	<p class="dx1">感谢相遇-女</p><br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	        <div class="yh1" id='wh10' style="position:absolute;top: 300px;left:500px;">
	       	        	<img class="tou" src="img2/006H2gbKgy1fcr5rqihszj30go0gogms.jpg" alt="" />
	       	        	<p class="dx1">偏爱自由-女</p><br /><p class="pvc1">旅行爱好者</p>
	       	        </div>
	       	     <ul id="ulsy">
	       	     	<li>「探险家」是一个基于生活的经验交流社区。</li>
	       	     	<li>如果你在旅行或者生活中发现了美好的事物，</li>
	       	     	<li>你可以用拍照或者以文字方式把它记录下来</li>
	       	     	<li>将它分享到我们这里，与大家一起欣赏</li>
	       	     	<li>并探索更多有趣的地方，结交志同道合的人。</li>
	       	     	<li>「探险家」欢迎你的加入</li>
	       	     </ul>
	        </div>
	       <div class="dan" id="box33child">
	       	   <div id="dongt1">
	       	   	     <div class="fazhe" style="width: 100%;height: 100%;position: relative;">
	       	   	     	  <div class="dianji">
	       	   	     	  	<img class="shuaxin" src="img2/zshuaxin.png" alt="" />
	       	   	     	  </div>
	       	   	       <div class="dong1">
	       	   	    	<img class="touxiang" src="img2/20150212213059_ycnGF.thumb.224_0.jpeg" alt="" />
	       	   	    	<p class="wangming">尾巴开箱</p>
	       	   	    	<p class="shijian">一天前</p>
	       	   	    	<div class="log1">
	       	   	    		<img src="img2/qing.png" alt="" />
	       	   	    		<p>漫漫求学路</p>
	       	   	    	</div>
	       	   	    </div>
	       	   	     <div class="dong2">先承认自己平凡，再成就自己的不凡.</div>
	       	   	      <div class="dong3">
	       	   	      	<img class="aixin" src="img2/aixin.png" alt="" />
	       	   	      	<img class="xinxi" src="img2/xinxi.png" alt="" />
	       	   	      </div>
	       	   	   </div>
	       	   </div>
	       	   <div id="dongt2">
	       	   	  <div class="fazhe" style="width: 100%;height: 100%;position: relative;">
	       	   	     	   <img class="shuaxin" src="img2/zshuaxin.png" alt="" />
	       	   	     <div class="dong1">
	       	   	    	<img class="touxiang" src="img2/006H2gbKgy1fcr5rqihszj30go0gogms.jpg" alt="" />
	       	   	    	<p class="wangming">快乐的狗子</p>
	       	   	    	<p class="shijian">两天前</p>
	       	   	    	<div class="log1">
	       	   	    		<img src="img2/qing.png" alt="" />
	       	   	    		<p>大步前行</p>
	       	   	    	</div>
	       	   	    </div>
	       	   	     <div class="dong2">用时间和心看人而不是眼睛和那些闲言碎语。</div>
	       	   	      <div class="dong3">
	       	   	      	<img class="aixin" src="img2/aixin.png" alt="" />
	       	   	      	<img class="xinxi" src="img2/xinxi.png" alt="" />
	       	   	      </div>
	       	   	  </div>
	       	   </div>
	       	   <div id="dongt3">
	       	   	  <div class="fazhe" style="width: 100%;height: 100%;position: relative;">
	       	   	     	   <img class="shuaxin" src="img2/zshuaxin.png" alt="" />
	       	   	     <div class="dong1">
	       	   	    	<img class="touxiang" src="img2/51284ff5d3ea4_200x200_3.jpg" alt="" />
	       	   	    	<p class="wangming">凉城听暖</p>
	       	   	    	<p class="shijian">一天前</p>
	       	   	    	<div class="log1">
	       	   	    		<img src="img2/qing.png" alt="" />
	       	   	    		<p>漫漫求学路</p>
	       	   	    	</div>
	       	   	    </div>
	       	   	     <div class="dong2">走得最急的，都是最美的风景</div>
	       	   	      <div class="dong3">
	       	   	      	<img class="aixin" src="img2/aixin.png" alt="" />
	       	   	      	<img class="xinxi" src="img2/xinxi.png" alt="" />
	       	   	      </div>
	       	   </div>
	       	   </div>
	       </div>
		</div>
	  <div id="boxb">
	   	 <div id="xiao">
	   	   <div id="yonghu">
	   	  	<img class="xx1" src="img2/x.png"/>
	   	  	<input type="text" name="username" class="inp" id="inp1" placeholder="手机号或邮箱" />
			<input type="password" name="pass" class="inp" id="inp2" placeholder="请输入密码" />
			<button id="deng1">登录</button>
	   	  </div>
	   	   <div id="mima">
	   	   	<img class="xx1" src="img2/x.png"/>
	   	  	<input type="text" name="username" class="inp" id="zu1" placeholder="请设置用户名" />
			<input type="password" name="pass" class="inp" id="zu2" placeholder="请设置密码" />
			<button id="zu3">注册</button>
	   	  </div>
	   	</div>
	  </div>
	</div>
		<script src="JS/jquery-2.1.0.js" type="text/javascript"></script>
	    <script src="JS/Size-patternChild.js" type="text/javascript"></script>
	</body>
</html>
